<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>index</title>
	<link rel="stylesheet" type="text/css" href="./css/index.css">
</head>
<body>
	<!-- 1.	变量 -->
	<div class="bl">变量</div>
	<hr/>
	<!-- 2.	嵌套CSS规则 -->
	<div class="content">
		<div class="box1">
			<p>想吃小蛋糕</p>
			<span>想吃小蛋糕</span>
		</div>
		<div class="box2">
			<h1>想吃小蛋糕</h1>
		</div>
	</div>
	<hr/>
	<!-- 父选择器的标识符& -->
	<div class="ulist">
		<ul>
		<li>想吃小蛋糕</li>
		<li>想吃小蛋糕</li>
		<li>想吃小蛋糕</li>
		<li>想吃小蛋糕</li>
		<li>想吃小蛋糕</li>
	</ul>
	</div>
	<hr/>
	<!-- 群组选择器的嵌套 -->
	<div class="container">
		<h1>想吃小蛋糕</h1>
		<h2>想吃小蛋糕</h2>
		<h3>想吃小蛋糕</h3>
	</div>
	<hr/>
	<!-- 嵌套属性 -->
	<div class="eleContainer"></div>
	<hr/>
	<!-- 混合器中的CSS规则 -->
	<div class="btn">click</div>
	<!-- 混合器传参 -->
	<div class="btn1">click</div>
</body>
</html>